<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>generator</title>
</head>
<body>
    
    <script>
    
        {
            // generator 解决异步

            let tell = function* () {
                yield 'a';
                yield 'b';
                return 'c';
            }

            let k = tell ();

            console.log(k.next());
            console.log(k.next());
            console.log(k.next());
            console.log(k.next());

            /**
             *  {value: "a", done: false}
             *  {value: "b", done: false}
             *  {value: "c", done: true}
             *  {value: undefined, done: true}
            */
        }


        {
            let obj = {};
            obj[Symbol.iterator] = function* () {
                yield 1;
                yield 2;
                yield 3;
            }

            for (const value of obj) {
                console.log(value);
            }
        }


        {

            // 循环

            let state = function* () {
                while (1) {
                    yield 'a';
                    yield 'b';
                    yield 'c';
                }
            }

            let status = state();

            console.log(status.next());
            console.log(status.next());
            console.log(status.next());
            console.log(status.next());
            console.log(status.next());
            console.log(status.next());
            console.log(status.next());

            /**
             * {value: "a", done: false}
               {value: "b", done: false}
               {value: "c", done: false}
               {value: "a", done: false}
               {value: "b", done: false}
               {value: "c", done: false}
               {value: "a", done: false}
            */



        }

        {
            // 抽奖

            let draw = function (count) {
                // 抽奖逻辑
                console.info(`剩余${count}次`);
            }

            // generator 控制抽奖次数
            let residue = function* (count) {
                while (count>0) {
                    count --;
                    yield draw(count);
                }
            }

            let star = residue(5);
            let btn = document.createElement('button');
            btn.id = 'start';
            btn.textContent = '抽奖';
            document.body.appendChild(btn);
            document.getElementById('start').addEventListener('click',function () {
                star.next();
            },false);

        }

        {
            // 长轮询 不断访问服务器状态
            let ajax = function* () {
                yield new Promise((resolve,reject)=>{
                    setTimeout(() => {
                        resolve({code: 0});
                    }, 1000);
                })
            }

            let pull = function () {
                let generator = ajax();
                let step = generator.next();
                step.value.then((d)=>{
                    if (d.code != 0) { // 不等于0 不是最新的数据 要每隔1秒查询
                        setTimeout(() => {
                            console.log('wait');
                            pull();
                        }, 1000);
                    } else {
                        console.log(d);
                    }
                })
            }

            pull ();
        }
    
    </script>
</body>
</html>